<!--
   线索管理（四中心）
 * @Author: hern
 * @Date: 2021-06-12 9:00:00
 * @project: 天津YQ平台
-->
<template>
    <div class="clue-follow-wrapper">
        <el-form ref="ruleForm"
                :model="followForm"
                label-width="100px">
            <el-form-item label="指向时间">
                <div>
                    <div>
                        <el-radio-group v-model="followForm.zxlx">
                            <el-radio v-for="(option, index) in zxsjOption" :key="index"
                                      :label="option.value">{{option.label}}</el-radio>
                        </el-radio-group>
                    </div>
                    <div class="m-t-1rem">
                        <el-date-picker
                                v-model="followForm.zxsj"
                                :disabled="followForm.zxlx !== '5'"
                                type="datetime"
                                value-format="yyyyMMddHHmmss"
                                format="yyyy-MM-dd HH:mm"
                                placeholder="请选择自定义时间"
                                clearable
                        />
                    </div>
                </div>
            </el-form-item>
            <div v-footer>
                <dg-button type="primary" @click="saveFollowInfo">提交</dg-button>
                <dg-button @click="handleCancel">取消</dg-button>
            </div>
        </el-form>
    </div>
</template>

<script>
    import {mapState} from 'vuex';
    import {BM_ZXLX} from '@/common/codeDic';
    import { fourconter } from '@/api/szxApi';
    import { handleZxTime } from '../data-process';
    export default {
        name: 'FollowComp',
        components: {},
        props: {
            clueId: { // 线索id
                type: String,
                default: ''
            }
        },
        data() {
            return {
                BM_ZXLX,
                followForm: {
                    id: this.clueId,
                    zxlx: '1',
                    zxsj: ''
                }, // 表单对象
            }
        },
        computed: {
            ...mapState(['constant']),
            zxsjOption(){
                let result = [];

                if (!_.isEmpty(this.constant[this.BM_ZXLX])){
                    result = this.constant[this.BM_ZXLX];
                }

                return result;
            }
        },
        created() {
            this.$store.dispatch('getConstant', ['BM_ZXLX']);
        },
        mounted() {
            // this.initPage();
        },
        methods: {
            /**
             * 初始化界面
             */
            initPage() {
                // 查询关注信息
                this.getFollowInfo();
            },
            /**
             * 查询关注信息
             */
            getFollowInfo() {
                if (!this.clueId) {
                    return;
                }

                new Promise((resolve, reject) => {
                    let result = {
                        status: '1',
                        data: {}
                    };
                    resolve(result);
                }).then(res => {
                    if (res.status == '200') {
                        this.followForm = res.data;
                    } else {
                        this.$message.error(`查询关注信息失效：${res.errorMessage}`);
                    }
                }).catch(err => this.$message.error(`查询关注信息失效：${err}`));
            },
            /**
             * 保存关注信息
             */
            saveFollowInfo() {
                let condition = this.handleSaveCondition();
                fourconter(condition).then(res => {
                    if (res.status == '200') {
                        // 构造请求参数
                        this.$message.success('关注成功');
                        this.$emit('success');
                    } else {
                        this.$message.error(`查询关注信息失效：${res.errorMessage}`);
                    }
                }).catch(err => this.$message.error(`提交关注信息失效：${err}`));
            },
            handleCancel() {
                this.$emit("close");
            },
            /**
             * 格式化保存信息接口入参
             */
            handleSaveCondition(){
                let result = JSON.parse(JSON.stringify(this.followForm));
                // 如果是非自定义，构造具体的对应时间yyyy-MM-dd HH:mm
                // if (result.zxsj !== '5'){
                //     result['customTime'] = handleZxTime(result.zxsj);
                // }

                return result;
            }
        }
    }
</script>

<style lang="scss">
    .m-t-1rem {
        margin-top: 1rem;
    }
</style>